在Angular，為什麼需要服務(Service)元件，因為在元件(Component)，不應該直接獲取或儲存資料，它們應該聚焦於展示資料，而把資料訪問的職責委託給某個服務才對。

而在資料庫的對應上，也是在服務(Service)元件，這一層來做，無論是呼叫Web API或是用模擬的假資料。而為了要建立服務(Service)元件。我們要先之前範例上的陣列資料，建立出對應的資料類別。讓後續的服務(Service)元件或Web API都可以應該的到。

所以，在app目錄，選取子視窗，選取「New File」，直接輸入「employeeinfo.ts」，注意的是，連副檔名，都要輸入。來建立對應的資料類別，程式碼如下：

export class Employeeinfo {
  // 編號
  id: number;
  // 員工編號
  serialnumber: string;
  // 姓名
  name: string;
  // 地址
  address: string;
}

原來的employeelist.ts，要修改為，依資料類別，來設定陣列資料，如下程式碼：

// 引用資料類別
import { Employeeinfo } from './employeeinfo';

export const employeelist: Employeeinfo[] = [
    { id: 1, serialnumber: 'W01', name: '張三', address: '台北市內湖區' },
    { id: 2, serialnumber: 'W02', name: '李四', address: '台北市信義區' },
    { id: 3, serialnumber: 'W03', name: '王五', address: '' }
];

後續，再來討論如何建立出一個服務(Service)元件，讓我們可以呼叫後，取得原來的員工資料。